<!--
 * @Author: zsc
 * @Date: 2022-06-13 21:56:52
 * @LastEditors: zsc
 * @LastEditTime: 2022-07-26 01:10:24
 * @Description:
-->

<template>
  <page>
    <span slot="other" style="margin:20px;font-size:30px">楼宇侧预警</span>
    <!--    查询条件-->
    <el-row slot="where">

      <el-col :span="24" class="k-text-left">

        <span>楼宇名称</span>
        <el-input v-model="WHERE.search" class="k-width-150-p k-mr-10" />
        <el-button type="primary" @click="_search">查询</el-button>
        <el-button type="primary" @click="_reset">重置</el-button>
      </el-col>
    </el-row>
    <!--    表格-->
    <el-table
      slot="table"
      ref="tb"
      v-loading="LOADING"
      :data="CLASS_TABLE_DATA"
      :size="SIZE"
      border
      :height="LIST_HEIGHT"
      style="width: 100%"
      @selection-change="_handleSelectionChange"
    >
      <el-table-column
        type="selection"
        width="55"
      />
      <template v-for="(item) in setting">
        <el-table-column
          v-if="item.key === 'action'"
          :key="item.id"
          :label="item.name"
          :prop="item.key"
          :width="item.value"
          :fixed="item.fixed"
        >
          <template slot-scope="scope">

            <el-button @click="handleCompany(scope.row)">企业预警</el-button>
          </template>

        </el-table-column>
        <el-table-column
          v-else-if="item.key === 'area'"
          :key="item.id"
          :label="item.name"
          :prop="item.key"
          :width="item.value"
        >
          <template slot-scope="scope">
            <span>{{ scope.row.region_info.street_name }}</span>
          </template>

        </el-table-column>
        <el-table-column
          v-else-if="item.key === 'statusDisplay'"
          :key="item.id"
          :label="item.name"
          :prop="item.key"
          :width="item.value"
        >
          <template slot-scope="scope">
            <span>{{ handleGetstatus(scope.row.status) }}</span>
          </template>

        </el-table-column>
        <el-table-column
          v-else-if="item.key === 'warningStatusDisplay'"
          :key="item.id"
          :label="item.name"
          :prop="item.key"
          :width="item.value"
        >
          <template>
            <span><el-tag type="success">无异常</el-tag></span>
          </template>

        </el-table-column>
        <el-table-column
          v-else
          :key="item.id"
          :label="item.name"
          :prop="item.key"
          :width="item.value"
        />
      </template>
    </el-table>
    <!--    分页-->
    <pagination slot="pagination" />
    <!--    弹窗-->
    <template slot="modal">
      <company-modal :visible.sync="companyVisible" :building-id="buildingId" />
    </template>
  </page>
</template>

<script>
import list from '@/list'
import BuildingClass from '@/models/building-class-warning'
import { buildingGetList } from '@/api/building'
import companyModal from './components/companyList'
const buildingClass = new BuildingClass()
export default {
  name: 'DeepInterpretationOrder',
  components: { companyModal },
  mixins: [list],
  data() {
    return {
      gateVisible: false,
      gateData: '',
      scanVisible: false,
      scanData: 0,
      companyVisible: false,
      roomVisible: false,
      buildingId: 0,
      qrcode_visible: false,
      regionId: 0,
      caseRequestURLType: '',
      setting: buildingClass.list(),
      WHERE: {
        buildingName: '' // 访问类型
      },
      buildingName: '',
      statusmMap: [
        { val: 1, text: '已建' },
        { val: 2, text: '在建' },
        { val: 3, text: '待建' }
      ]
    }
  },
  created() {
    this.LIST_API = buildingGetList
  },
  mounted() {
  },
  methods: {

    handleCompany(item) {
      console.log('企业列表')
      this.companyVisible = true
      this.buildingId = item.id
    },
    handleGetstatus(item) {
      return this.statusmMap.find(p => p.val === item).text
    }

  }
}
</script>
<style lang="scss">
@import '@/styles/list/index.scss';
</style>
